<template>
    <div>
        <input type="text" v-model="msg">
        <button @click="send()">send</button>
        <button @click="close()">与服务端断开连接</button>
    </div>
</template>
<script>
export default {
    
    data() {
        return {
            ws:{},
            msg:""
        }
    },
    methods:{
        send(){
            //回应
             this.ws.send(this.msg);
        },
        close(){
            this.ws.close();
            
        }
    },
    created() {
        //立即与服务端建立websocekt连接
         
        this.ws = new WebSocket("ws://localhost:8001/demo");

      
        this.ws.onopen = function (event) {
            console.log("open");
        };


        this.ws.onmessage = function (event) {
            //打印服务端数据
             console.log(event);
            

        };
        this.ws.onclose = function (event) {
            console.log("byebye..");
        };  
    },
}
</script>
<style lang="css">
    




</style>